import { onMounted, onUnmounted, ref } from 'vue'
import { throttle } from 'underscore'

export default function useScroll() {
  const isBottom = ref(false)
  const scrollTop = ref(0)
  const clientHeight = ref(0)
  const scrollHeight = ref(0)

  const scrollListenerHandler = throttle(() => {
    scrollTop.value = document.documentElement.scrollTop
    clientHeight.value = document.documentElement.clientHeight
    scrollHeight.value = document.documentElement.scrollHeight
    if (Math.ceil(scrollTop.value + clientHeight.value) >= scrollHeight.value) {
      // homeStore.fetchHouseList()
      isBottom.value = true
    }
  }, 1000)

  // 监听网页滚动
  onMounted(() => {
    window.addEventListener('scroll', scrollListenerHandler)
  })

  // 移除监听
  onUnmounted(() => {
    window.removeEventListener("scroll", scrollListenerHandler)
  })

  return {
    isBottom,
    scrollTop,
    clientHeight,
    scrollHeight
  }
}